Administrator Guide 2017
Change how questions look on the device

Use Display Classes to guide device users to enter the correct information

Most template items have an option to enter display classes.  Display classes can also be set for a whole section and (usually) page and document.

These are special words that change the colour, size and position of questions and answers on the device.  

  • The syntax is [setting1]:[value1];[setting2]:[value2];etc - ie a colon (:) between setting and value and a semi-colon (;) between each setting.  For example, colour:navy;scale:200 would make an answer twice as big in dark blue.
  • The settings below change the appearance of the answer - to apply the same settings to the questions prefix the setting with lab.
  • Settings are hierarchical in that a setting in a template item will override the same setting in the section - so if a section set all answer boxes to be 50% and a particular answer needed to be full width it could use width:100 to override it.
  • Most of the settings assume that the section is of layout type One line - Question Left, Answer Right although the opposite way around should also work.

align
  • centre
  • left
  • right
scale

percentage value as a multiplier.  In other wordsscale:50 would be half the normal size where as scale:200 would be double.         

colour

can be in the HEX format #RRGGBB or #AARRGGBB where

  • A is the alpha channel controlling transparency
  • R is the Red component
  • G is the Green component
  • B is the Blue component

or named colours

  • red
  • blue
  • green
  • black
  • white
  • gray
  • cyan
  • magenta
  • yellow
  • lightgray
  • darkgray
  • grey
  • lightgrey
  • darkgrey
  • aqua
  • fuchsia
  • lime
  • maroon
  • navy
  • olive
  • purple
  • silver
  • teal
width changes the size of the answer box using the same percentage system as scale.  In other wordswidth:50 would be make the answer box half of the width of the device screen.  Obviously, more than 100 will not work

leftpc

rightpc

these work together to change the relative size of the question and answer box.  It only works if the Section layout type is one of the 'same line' ones.  The most common use is leftpc:1;rightpc:2, which makes the answer box twice the width of the question (in the usual section layout).
backcolour uses the same values as colour but applies them to the background rather than the text
labcolour uses the same values as colour but applies them to the label rather than the text

padtop

padbottom

create more space between questions in pixels, for example padtop:10;padbottom:10 on all questions would put 20 pixels between them all.

back

bubble is the only value allowed here.  This creates a lozenge shaped background for the text which is useful for highlighting information such as help text or additional instructions.  It will always be the same pink colour (known as lobster bisque!).
See Also

Templates